<template>
  <div>
    <form-head @onSubmit="onSubmit" :is_change="is_change"/>
    <el-form ref="form" :rules="rules" :model="form" label-width="100px" class="layout-all form-width" >
      <el-form-item label="礼物名字" prop="gift_name">
        <el-input v-model="form.gift_name" placeholder="请输入礼物名" />
      </el-form-item>
     
      <el-form-item label="礼物图片:" prop="gift_pic">
        <upload-pic :thumb="form.gift_pic" @update:thumb="form.gift_pic=$event" width="100"/>
      </el-form-item>
      <el-form-item label="礼物价格:" prop="gift_price">
        <el-input v-model="form.gift_price" placeholder="请输入礼物价格" />
      </el-form-item>
      <el-form-item label="排序:" prop="gift_sort">
        <el-input v-model="form.gift_sort" placeholder="请输入排序" type="number" />
      </el-form-item>
      <el-form-item label="是否启用:" prop="gift_status">
        <el-switch
          v-model="form.gift_status"
          active-color="#13ce66"
          inactive-color="#ff4949"
        />
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
export default {
  data() {
    return {
      // type_option: [{ value: 0, label: '首页' }],
      id: 0,
      is_change: true,
      gift_pic: '',
      form: {
        id: 0,
        gift_sort: 0,
        gift_status: true,
        gift_name: '',
        gift_price: '',
        gift_pic: ''
      },
      rules: {
        gift_name: [
          { required: true, message: '请输入名称', trigger: 'blur' }
        ],
        gift_price: [
          { required: true, message: '请输入价格', trigger: 'blur' }
        ]
      }
    }
  },
  mounted() {
    // if (this.$route.query.id) {
    //   this.id = this.$route.query.id
    // }
  },
  methods: {

    // 提交
    onSubmit(formName) {
      const form = this.form
      console.log(form)
      this.$refs[formName].validate(valid => {
        if (valid) {
          form.id = this.id
          form.status === true ? form.status = 1 : form.status = 0
          this.get('/admin/LiveGift/save', form, 'POST').then(e => {
            this.$back()
          })
          
        } else {
          console.log('error submit!!')
          return false
        }
      })
      console.log('submit!')
    },
    // 返回
    bk() {
      this.$router.back()
    },
    // 获取当前数据
    // init_into() {
    //   this.get('/admin/Banner/info?id=' + this.id, 'POST').then(e => {
    //     const tpl = e.info.tpl
    //     tpl.status === 1 || tpl.status === '' ? this.form.status = true : this.form.status = false
    //     this.form.id = tpl.id
    //     tpl.sort ? (this.form.sort = tpl.sort) : ''
    //     this.form.title = tpl.title
    //     this.form.url = tpl.url
    //     this.form.thumb = tpl.thumb
    //     this.thumb = tpl.thumb
    //     console.log(this.form)
    //   })
    // }
  }
}
</script>

<style>
.layout-all {
  margin: 10px;
}
</style>
